<template>
    <div class="father">
        <h3>父组件</h3>
        {{ username }}<br/>{{ pasword }}<br/>
        <!--   v-model用在html标签上 -->
        <!-- <input type="text" v-model="username"> -->
        <!-- <input type="text" :value="username" @input="username=(<HTMLInputElement>$event.target).value"> -->

        <!--   v-model用在组件标签上 -->
        <!-- <ChenInput v-model="username"></ChenInput> -->

        <!-- <ChenInput 
        :modelValue="username"
         @update:modelValue="username = $event">
        </ChenInput> -->
        <!-- 修改modelValue -->

        <ChenInput v-model:ming="username" v-model:mima="pasword"></ChenInput>


    </div>
</template>

<script setup lang="ts" name="Father">
import { ref } from "vue";
import ChenInput from "./ChenInput.vue"

let username = ref("zhanshan")
let pasword = ref("123456")

</script>

<style  scoped>
.father {
    background-color: reb(165, 164, 164);
    padding: 20px;
    border-radius: 10px;
}
</style>